<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE HTML>
<html>
<head>
	<meta charset="UTF-8">
	<link rel="stylesheet" href="static/css/common.css" />
	
	<link rel="stylesheet" href="static/layui/css/layui.css" />
	<link rel="stylesheet" href="http://at.alicdn.com/t/font_949625_3t06xc90k9c.css" type="text/css">
	<script src="static/js/jquery-1.12.4.min.js"></script>
	<script src="static/layui/layui.all.js"></script>
	<style>
		.layui-inline{
			width:47%;
		}
		html, body{
			width: 100%;
            background: url("static/images/xy-bg.jpg") no-repeat center top #fff;
		}
		.zcwit form{
			width: 970px;
			margin: 0 auto;
			border: 1px solid #e6e6e6;
			padding: 20px 15px;
		}
		.bannwit{
			width: 77%;
		}
		.logo {
            height: 90px;
            width: 1000px;
            margin: 0 auto;
            padding-top: 20px;
		}
		.layui-tab-title li{
			display: block;
			height: 50px;
			line-height: 50px;
			background: #f2f2f0;
			font-size: 20px;
		}
		.layui-tab-title{
			float: left;
			width: 200px;
			height: 100px;
		}
		.layui-tab-content{
			float: left;
			width: 750px;
		}
		.clear{ clear:both}
		.layui-tab-title .layui-this:after{
			height: 50px;
		}
		.layui-tab-brief>.layui-tab-title .layui-this {
			color: #fff;
			background: #af0000;
			font-size: 20px;
		}
		.layui-tab-brief>.layui-tab-more li.layui-this:after, .layui-tab-brief>.layui-tab-title .layui-this:after {
			border: none;
			border-radius: 0;
			border-bottom: 2px solid #f7d92b;
		}
		.layui-tab-content {
			padding: 0px 0px 10px 15px;
		}
		.logo img:hover {
			cursor:pointer;
}
	</style>
</head>
<body>
<div class="logo"><img src="static/images/logo-xy.png" onclick="location.href='login'"/></div>
<div class="layui-layout layui-layout-admin">
	<div class="layui-col-md-12 column zcwit">
	
		<form class="layui-form white-bg" action="toXybmsave" onsubmit="">

			<div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief" style="position: relative;">
				<ul class="layui-tab-title">
					<c:forEach items="${type}" var="c" varStatus="vs">
						<c:if test="${vs.count==1}">
							<li class="layui-this" onclick="tbClassUser(this.title)" title="${c.type}" id="tbclassType">${c.type}学员</li>
						</c:if>
						<c:if test="${vs.count!=1}">
							<li onclick="tbClassUser(this.title)" title="${c.type}">${c.type}学员</li>
						</c:if>
					</c:forEach>
				</ul>
				<div class="layui-tab-content" >
					<div class="layui-tab-item layui-show">
						<fieldset class="layui-elem-field layui-field-title site-title">
							<legend><a name="fixbar" id="fixbart">主体班学员注册</a></legend>
						</fieldset>
						<div class="layui-form-item">
							<label class="layui-form-label"><span style="color: #EF4750">*</span> 申报班级</label>
							<div class="layui-input-block bannwit">
									<select name="tbClassNmae"  id="selectTbClass" lay-verify="required" lay-filter="tbClassselect">
										<option value=""></option>
									</select>		
											
							</div>
						</div>
						<div class="layui-form-item">
							<label class="layui-form-label"><span style="color: #EF4750">*</span> 培训时间</label>
							<div class="layui-input-block bannwit">
								<input type="text" name="title" id="titletimeinput" readonly="readonly" required placeholder="培训时间" autocomplete="off" class="layui-input" value="">
							</div>
						</div>
						<div class="layui-form-item">
							<div class="layui-inline">
								<label class="layui-form-label"><span style="color: #EF4750">*</span> 身份证号</label>
								<div class="layui-input-block">
									<input type="text" name="idcode" required   lay-verify="required|identity" placeholder="请输入身份证号" autocomplete="off" class="layui-input" onchange="funidcode(this.value)" value="">
								</div>
							</div>
							<div class="layui-inline">
								<label class="layui-form-label"><span style="color: #EF4750">*</span> 姓名</label>
								<div class="layui-input-block">
									<input type="text" name="name" required  lay-verify="required" placeholder="请输入姓名" autocomplete="off" class="layui-input" value="">
								</div>
							</div>

						</div>
						<div class="layui-form-item">
							<div class="layui-inline">
								<label class="layui-form-label"><span style="color: #EF4750">*</span> 性别</label>
								<div class="layui-input-block">
									<input type="radio" name="sex" value="男" title="男" >
									<input type="radio" name="sex" value="女" title="女">
								</div>
							</div>
							<div class="layui-inline">
								<label class="layui-form-label"><span style="color: #EF4750">*</span> 出生年月</label>
								<div class="layui-input-block">
									<input type="text" name="bron" class="layui-input" id="start_time" lay-verify="required|date">
								</div>
							</div>
							

						</div>
						<div class="layui-form-item">
							<div class="layui-inline">
								<label class="layui-form-label"><span style="color: #EF4750">*</span> 民族</label>
								<div class="layui-input-block">
									<select name="nation" lay-verify="required">
										
									</select>						
								</div>
							</div>
							<div class="layui-inline">
								<label class="layui-form-label"><span style="color: #EF4750">*</span> 文化程度</label>
								<div class="layui-input-block">
									<select name="degree" lay-verify="required">
										
									</select>						
								</div> 
							</div>
							

						</div>
						<div class="layui-form-item">
							<div class="layui-inline">
								<label class="layui-form-label"><span style="color: #EF4750">*</span> 政治面貌</label>
								<div class="layui-input-block">
									<select name="politics" lay-verify="required" lay-filter="politics">
										
									</select>						
								</div>
							</div>
							<div class="layui-inline">
								<label class="layui-form-label">专业职称</label>
								<div class="layui-input-block">
									<input type="text" name="speciality"   placeholder="请输入专业" autocomplete="off" class="layui-input" value="">
								</div>
							</div>
						</div>
						
						<div class="layui-form-item" style="display: none;" id="politicstimediv">
							<div class="layui-inline">
								<label class="layui-form-label"> 入党时间</label>
								<div class="layui-input-block">
									<input type="text" name="politicstime" class="layui-input" id="politicstime">		
								</div>
							</div>
						</div>
						
						<div class="layui-form-item">
							<div class="layui-inline">
								<label class="layui-form-label"><span style="color: #EF4750">*</span> 工作单位</label>
								<div class="layui-input-block">
									<input type="text" name="workUnit" required  lay-verify="required" placeholder="请输入工作单位" autocomplete="off" class="layui-input" value="">
								</div>
							</div>
							<div class="layui-inline">
								<label class="layui-form-label"> 现任职务</label>
								<div class="layui-input-block">
									<input type="text" name="job"  placeholder="请输入现任职务" autocomplete="off" class="layui-input" value="">
								</div>
							</div>


						</div>
						<div class="layui-form-item">
							<div class="layui-inline">
								<label class="layui-form-label">职级</label>
								<div class="layui-input-block">
									<input type="text" name="jobLevel"  placeholder="请输入职级" autocomplete="off" class="layui-input" value="">
								</div>
							</div>
							<div class="layui-inline">
								<label class="layui-form-label"><span style="color: #EF4750">*</span> 办公电话</label>
								<div class="layui-input-block">
									<input type="text" name="officetel" required  lay-verify="required" placeholder="请输入办公电话" autocomplete="off" class="layui-input" value="">
								</div>
							</div>
						</div>
						<div class="layui-form-item">
							<div class="layui-inline">
								<label class="layui-form-label"><span style="color: #EF4750">*</span> 手机</label>
								<div class="layui-input-block">
									<input type="text" name="phone" required  lay-verify="required|phone" placeholder="请输入手机" autocomplete="off" class="layui-input" value="">
								</div>
							</div>
							<div class="layui-inline">
								<label class="layui-form-label"><span style="color: #EF4750">*</span> 单位地址</label>
								<div class="layui-input-block">
									<input type="text" name="address" required  lay-verify="required" placeholder="请输入单位地址" autocomplete="off" class="layui-input" value="">
								</div>
							</div>
						</div>
						<div class="layui-form-item">
							<div class="layui-inline">
								<label class="layui-form-label"><span style="color: #EF4750">*</span> 邮政编码</label>
								<div class="layui-input-block">
									<input type="text" name="postalCode" required  lay-verify="required" placeholder="请输入邮政编码" autocomplete="off" class="layui-input" value="">
								</div>
							</div>
							<div class="layui-inline">
								<label class="layui-form-label" style="width: 103px"><span style="color: #EF4750;">*</span> 是否库区移民</label>
								<div class="layui-input-block" style="margin-left: 140px">
									<select name="isimmigrant" lay-verify="required">
										
									</select>									
								</div>
							</div>
						</div>
						
						
						<div class="layui-form-item">
							<div class="layui-inline">
								<label class="layui-form-label">照片</label>
								<div class="layui-input-block" id="layuiUp">
									<div class="layui-upload-drag" id="photo">
										<i class="layui-icon">&#xe67c;</i>
										<p>点击上传，或将文件拖拽到此处</p>
									</div>
								</div>			
							</div>
						</div>
						<div class="layui-form-item">
							<div class="layui-input-block">
								<input type="hidden" name="fileuuid" id="fileuuid" value="">
								<button class="layui-btn" lay-submit lay-filter="formDemo">提交报名</button>
							</div>
						</div>
					</div>
					
				</div>
				<div class="clear"></div>
			</div>
		</form>
	</div>
	
</div>
<script src="static/js/common.js"></script>
<script>
layui.use('laydate', function(){
	var laydate = layui.laydate;
	var form = layui.form;
	//年月选择器
	laydate.render({
		elem: '#start_time',
		value:""
	});
	
	
	laydate.render({
		elem: '#end_time',
		value:""
	});
	laydate.render({
		elem: '#politicstime',
		value:""
	});
	
	
	form.on('select(politics)', function(data){
		if(data.value=="中共党员"){
			$("#politicstimediv").show();
		}else{
			$("#politicstimediv").hide();
		}
	})
});


</script>
<script>
    layui.use('upload', function(){
        var upload = layui.upload;
        //执行实例
        var uploadInst = upload.render({
            elem: '#photo' //绑定元素
            ,url: 'toFilesave' //上传接口
            ,done: function(res){
                if(res.success){
                	$("#fileuuid").val(res.msg);
                	$("#photo").html('<img alt="" src="download?uuid='+res.msg+'" width="100px" height="100px" title="点击重新选择">' );
                }else{
                	layer.open({
                		title: '上传失败'
                		,content: res.msg
                		,time: 2000
                	});   
                }
            }
            ,error: function(){
                
            }
        });
    });
</script>
<script type="text/javascript">
	
	layui.use('form', function(){  //此段代码必不可少
	    var form = layui.form;
	    form.render();
	});
	function tbClassUser(value){
		if(value==""){
			value = "主体班";
		}
		$("#fixbart").text(value+"学员注册");
		var form = layui.form;
		$('#selectTbClass').empty();
		$("#titletimeinput").val("");
		$.post('totbClass',{value:value},function(data){
			var html ='<option value=""></option>';
			$('#selectTbClass').append(html);
			for(var a=0;a<data.length;a++){
				 $('#selectTbClass').append(new Option(data[a].name,data[a].id));
			}
			form.render();
		});
	}
	
	   
	
</script>
<script type="text/javascript">
	$(function(){
		var form = layui.form;
		form.on('select(tbClassselect)', function(data){
			$("#titletimeinput").val("");
			if(data.value!=""){
				$.post('toTime',{uuid:data.value},function(data){
					$("#titletimeinput").val(data);
				});
			}
		});  
		var titles = $("#tbclassType").text();
		if(titles.length>2){
			titles = titles.substr(0,titles.length-2);
		}
		tbClassUser(titles);
	});
	
	
	function funidcode(value){
		var form = layui.form;
		$.post('goidcode',{idcode:value},function(data){
			if(data.name!=null){
				$("input[name='name']").val(data.name);
				$("input[name='sex'][title='"+data.sex+"']").attr('checked',true);
				$("[name='nation'] option[value='"+data.nation+"']").attr("selected","true");
				$("input[name='bron']").val(data.bron);
				$("[name='politics'] option[value='"+data.politics+"']").attr("selected","true");
				$("[name='degree'] option[value='"+data.degree+"']").attr("selected","true");
				$("input[name='speciality']").val(data.speciality);
				
				$("input[name='workUnit']").val(data.workUnit);
				$("input[name='job']").val(data.job);
				$("input[name='jobLevel']").val(data.jobLevel);
				$("input[name='officetel']").val(data.officetel);
				$("input[name='phone']").val(data.phone);
				$("input[name='address']").val(data.address);
				$("input[name='postalCode']").val(data.postalCode);
				$("[name='isimmigrant'] option[value='"+data.isimmigrant+"']").attr("selected","true");
				$("#photo").html('<img alt="" src="download?uuid='+data.fileuuid+'" width="100px" height="100px" title="点击重新选择">' );
				form.render();
			}else{
				$("#photo").html('<i class="layui-icon">&#xe67c;</i><p>点击上传，或将文件拖拽到此处</p>' );
			}
		});
	}
</script>
<script type="text/javascript">
	/** 获取数据字典得数据 value是数据 idvalue是下拉条得value **/
	function systemdata(value,idvalue){
		var form = layui.form;
		$("[name="+idvalue+"]").append('<option value="" style="display:none"></option>')
		$.post('dict',{code:value},function(data){
			if(data!=null){
				for(var i=0;i<data.length;i++){
					$("[name="+idvalue+"]").append("<option value="+data[i].name+">"+data[i].name+"</option>")
				}
				form.render();
			}
		});
	}
	$(function(){
		systemdata("nation","nation");
		systemdata("political_outlook","politics");
		systemdata("education","degree");
		systemdata("isimmigrant","isimmigrant");
	});
</script>
</body>
</html>